<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>房屋位置添加</title>
    <link th:replace="common/header"/>
</head>
<body class="no-skin">
<div th:replace="common/top"/>
<div class="main-container ace-save-state" id="main-container">
    <div th:replace="common/menu"/>
    <div class="main-content">
        <div class="main-content-inner">
            <div th:replace="common/title"/>
            <div class="page-content">
                <div th:replace="common/skin"/>
                <div class="row-fluid">
                    <div class="col-xs-12">
                        <!-- PAGE CONTENT BEGINS -->
                        <h3 class="header smaller lighter blue"><i class="fa fa-list" aria-hidden="true"></i>房屋位置添加
                            <a shiro:hasPermission="/houseInfo/getAll" class="btn-xs btn" href="getAll"
                               th:href="@{/houseInfo/getAll}"><i class="fa fa-reply"
                                                                 aria-hidden="true"></i>返回</a>
                        </h3>

                        <!-- PAGE CONTENT ENDS -->
                        <input type="hidden" id="houseId" name="houseId" th:value="${houseId}">
                        <input type="hidden" id="province" name="province" th:value="${province}">
                        <input type="hidden" id="city" name="city" th:value="${city}">
                        <input type="hidden" id="region" name="region" th:value="${region}">
                        <input type="hidden" id="lng" name="lng" th:value="${lng}">
                        <input type="hidden" id="lat" name="lat" th:value="${lat}">
                        <div class="row-fluid">
                            <div class="span12">
                                <div id="allmap" style="height: 800px;"></div>
                            </div>
                        </div>
                    </div><!-- /.col -->
                </div><!-- /.row -->
            </div><!-- /.page-content -->
        </div>
    </div><!-- /.main-content -->
    <div th:replace="common/footer"/>
</div><!-- /.main-container -->
<div th:replace="common/buttom"/>
<script th:src="@{/js/echarts/echarts.common.min.js}" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript"
        th:src="@{http://api.map.baidu.com/api?v=2.0&amp;ak=a75vDOuWpdLz4hUpRpWxakuGuL6MRlnL}"></script>
</body>
</html>
<script type="text/javascript">
    // 百度地图API功能
    var map = new BMap.Map("allmap");
    map.enableScrollWheelZoom();   //启用滚轮放大缩小，默认禁用
    map.enableContinuousZoom();    //启用地图惯性拖拽，默认禁用

    $(function () {
        var lng = $("#lng").val();
        var lat = $("#lat").val();
        if (lng === "" || lat === "") {
            getBoundary("#ff0000");
        } else {
            var point = new BMap.Point(lng, lat);
            var marker = new BMap.Marker(point);  // 创建标注
            map.addOverlay(marker);               // 将标注添加到地图中
            marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
            map.centerAndZoom(point, 12);
        }
    });

    function getBoundary(color) {
        var bdary = new BMap.Boundary();
        var location = $("#province").val() + $("#city").val() + $("#region").val()
        bdary.get(location, function (rs) {       //获取行政区域
            map.clearOverlays();        //清除地图覆盖物
            var count = rs.boundaries.length; //行政区域的点有多少个
            if (count === 0) {
                alert('未能获取当前输入行政区域');
                return;
            }
            var pointArray = [];
            for (var i = 0; i < count; i++) {
                var ply = new BMap.Polygon(rs.boundaries[i], {strokeWeight: 2, strokeColor: color}); //建立多边形覆盖物
                map.addOverlay(ply);  //添加覆盖物
                pointArray = pointArray.concat(ply.getPath());
            }
            map.setViewport(pointArray);    //调整视野
        });
    }

    //单击获取点击的经纬度
    map.addEventListener("click", function (e) {
        map.clearOverlays();
        // alert(e.point.lng + "," + e.point.lat);
        $.ajax({
            url: '/houseInfo/setLocation',
            type: "post",
            data: {houseId: $("#houseId").val(), lng: e.point.lng, lat: e.point.lat},
            dataType: "json",
            success: function (data) {
                if (data.success) {
                    point = new BMap.Point(e.point.lng, e.point.lat);
                    var marker = new BMap.Marker(point);  // 创建标注
                    map.addOverlay(marker);               // 将标注添加到地图中
                    marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
                } else {
                    alert(data.msg);
                }
            }
        });
    });
</script>
